<style>
#payment blockquote.area{
	width:976px;
	padding:2px;
}
#payment fieldset{
	float:left;
	padding:2px;
}
#payment fieldset legend{
	margin-left:180px;
}
#payment input[type=text].iznos{
	text-align:right;
}
#payment input[type=text].avans{
	border:none;
	background:transparent;
}
#payment input[type=button].plan{
	width:16px;
	height:16px;
	background:url(gui/ugovori/plan.gif) no-repeat center center;
	border:none;
	cursor:pointer;
	margin:8px 0px;
	display:none;
}
#payment #plan_table_holder{
	float:left;
	font-size:10px;
}
#payment #plan_table_holder table{
	border:none;
}
#payment #plan_table_holder table tr.head td{
	text-align:center;
	font-weight:normal;
}
#payment #plan_table_holder table td{
	border:none;
	padding:1px;
}
#payment #plan_table_holder table td input{
	margin:0px;
	font-size:10px;
}
#payment #plan_table_holder table tr td,
#payment #plan_table_holder table input[type=text].iznos{
	width:60px;
}
#payment #plan_table_holder table tr td:first-child{
	width:70px;
}
#payment #infoPlanUkupno{
	float:left;
	clear:both;
	font-size:10px;
	margin-left:10px;
}
#payment #infoPlanUkupno strong{
	display:block;
	float:left;
	width:69px;
	text-align:right;
}
#payment #infoPlanUkupno strong:first-child{width:60px;}
#payment input[type=button].import{
	margin:0px;
	padding:0px;
	width:22px;
	height:11px;
	background:url(gui/icons/xml.gif) no-repeat center center;
	cursor:pointer;
	float:left;
	border:none;
}
#payment ul#otplataList{
	float:left;
	list-style-type:none;
	margin:0px;
	padding:0px;
	text-align:left;
	font-size:10px;
}
#payment ul#otplataList li{
	display:block;
	float:left;
	clear:both;
	margin:0px;
	padding:0px;
}
#payment ul#otplataList li#summary{
	font-weight:bolder;
	text-align:right;
}
#payment ul#otplataList li#summary div{
	width:62px;
	padding:0px 2px;
	text-align:right;
}
#payment ul#otplataList li#summary div:last-child{
	width:auto;
}
#payment ul#otplataList li#template{
	display:none;
}
#payment ul#otplataList li:hover{
	background:#f80;
}
#payment ul#otplataList li.selected{
	background:#f80;
	-moz-opacity:0.2;
}
#payment ul#otplataList li.selected:hover{
	-moz-opacity:1;
}
#payment ul#otplataList li.head div{
	text-align:center;
	width:63px;
	padding:1px 2px;
	background:{{$highlight}};
	color:{{$highlighttext}};
}
#payment ul#otplataList li.head div:last-child{
	padding-top:0px;
	background:none;
	color:#000;
}
#payment ul#otplataList li.head div:last-child{
	width:auto;
}
#payment ul#otplataList li div{
	width:67px;
	float:left;
	margin:1px 1px 1px 1px;
	text-align:center;
}
#payment ul#otplataList li div:last-child{
	width:auto;
}
#payment ul#otplataList li input[type=text]{
	width:60px;
	margin:1px 0px 1px 0px;
	font-size:10px;
}
#payment ul#otplataList li input[type=button],
#payment ul#otplataList li input[type=checkbox]{
	cursor:pointer;
	margin:0px;
}
</style>

<div id="payment">
<div class="tab_top">
	<a href="javascript:void(0)" onclick="var _obj=this.parentNode.nextSibling.nextSibling; _obj.style.display=(_obj.style.display=='none')?'block':'none'" class="switcher">Plan otplate / Otplata ►</a>
</div>
<blockquote class="area">
	<fieldset style="width:45%;">
		<legend>PLAN OTPLATE</legend>
		<label class="left" for="plan_br_rata">broj rata:</label>
		<input value="{{$plan_br_rata}}" type="text" name="plan_br_rata" id="plan_br_rata" style="width:20px;" maxlength="2" onchange="var btn=document.getElementById('plan_button'); btn.click();" />
		<label class="left" for="plan_np">način plaćanja:</label>
		<select name="plan_np" id="plan_np">
			{{%loop start np_id}}
			<option value="{{$np_id}}" title="{{$np_name}}" {{$np_selected}}>{{$np_code}}</option>
			{{%loop end}}
		</select>
		<label class="left" for="plan_avans">Avans:</label>
		<input style="width:60px" value="{{$ugovor_avans}}" class="iznos" type="text" name="plan_avans" id="plan_avans" onfocus="this.value=strip_number_format(this.value)" onblur="if(this.value.match(/%/)){var p=parseFloat(this.value.replace(/[^\d]/g,'')); var b=document.getElementById('ugovor_iznos_bruto').value; b=parseFloat(strip_number_format(b)); this.value=b*p/100;} this.value=number_format(this.value,2); var btn=this.nextSibling.nextSibling; btn.click();" />
		<input title="napravi plan" type="button" class="plan" id="plan_button" onclick="ugovorMakePlan(this)" />
		<input type="text" class="dateInput" value="{{$avans_date}}" name="plan_avans_date" id="plan_avans_date" onblur="var btn=document.getElementById('plan_button'); btn.click();" />
		<input type="button" class="datePicker" onclick="displayDatePicker('plan_avans_date',this)" />
		<br clear="all" />
		<div id="plan_table_holder">
			{{$plan_table}}
		</div>
	</fieldset>
	<fieldset>
		<legend>OTPLATA</legend>
		<input type="button" class="novi" onclick="ugovorAddOtplata()" style="margin:9px 0px 5px 470px;" />
		<input type="button" class="delete" onclick="ugovorRemoveOtplata()" style="margin:9px 0px 5px 5px;" />
		<br clear="all" />
		<ul id="otplataList">
			<li id="template">
				<div><input type="text" /></div>
				<div><input onclick="displayDatePicker(this.id)" type="text" /></div>
				<div><input onfocus="this.value=strip_number_format(this.value)" onblur="this.value=this.value.replace(/[^\d\.-]/g,'');if(this.value.length==0){this.value=0;} this.value=number_format(parseFloat(this.value),2); updateUgovorOtplataNtoPorez(this);" class="iznos" type="text" /></div>
				<div><input onfocus="this.value=strip_number_format(this.value)" onblur="this.value=this.value.replace(/[^\d\.]/g,'');if(this.value.length==0){this.value=0;} this.value=number_format(parseFloat(this.value),2)" class="iznos" type="text" disabled="disabled" /></div>
				<div><input onfocus="this.value=strip_number_format(this.value)" onblur="this.value=this.value.replace(/[^\d\.]/g,'');if(this.value.length==0){this.value=0;} this.value=number_format(parseFloat(this.value),2)" class="iznos" type="text" disabled="disabled" /></div>
				<div><input onfocus="this.value=strip_number_format(this.value)" onblur="this.value=this.value.replace(/[^\d\.]/g,'');if(this.value.length==0){this.value=0;} this.value=number_format(parseFloat(this.value),2)" class="iznos" type="text" /></div>
				<div><input onfocus="this.value=strip_number_format(this.value)" onblur="this.value=this.value.replace(/[^\d\.]/g,'');if(this.value.length==0){this.value=0;} this.value=number_format(parseFloat(this.value),2)" class="iznos" type="text" /></div>
				<div><input title="obeleži za brisanje" type="checkbox" onchange="this.parentNode.parentNode.className=this.parentNode.parentNode.className=='selected'?'':'selected';" /></div>
			</li>
			<li class="head">
				<div>izvod</div>
				<div>datum</div>
				<div>bruto</div>
				<div>neto</div>
				<div>porez</div>
				<div>kamata</div>
				<div>troškovi</div>
				<div>
					<!--<input title="Uvezi iz XML-a" type="button" class="import" value="uvezi" onclick="LoadRSDoc('ugovori.php?a=izvodi&mod=select','ypAjaxForm')" />-->
				</div>
			</li>
			{{%loop start otp_id}}
			<li id="{{$otp_num}}" otpid="{{$otp_id}}">
				<div><input type="text" value="{{$otp_izvod}}" /></div>
				<div><input id="datum{{$otp_num}}" name="datum{{$otp_num}}" onclick="displayDatePicker(this.id)" type="text" value="{{$otp_date}}" /></div>
				<div><input onfocus="this.value=strip_number_format(this.value)" onblur="this.value=this.value.replace(/[^\d\.-]/g,'');if(this.value.length==0){this.value=0;} this.value=number_format(parseFloat(this.value),2); updateUgovorOtplataNtoPorez(this);" class="iznos" type="text" value="{{$otp_bruto}}" /></div>
				<div><input onfocus="this.value=strip_number_format(this.value)" onblur="this.value=this.value.replace(/[^\d\.]/g,'');if(this.value.length==0){this.value=0;} this.value=number_format(parseFloat(this.value),2)" class="iznos" type="text" value="{{$otp_neto}}" disabled="disabled" /></div>
				<div><input onfocus="this.value=strip_number_format(this.value)" onblur="this.value=this.value.replace(/[^\d\.]/g,'');if(this.value.length==0){this.value=0;} this.value=number_format(parseFloat(this.value),2)" class="iznos" type="text" value="{{$otp_porez}}" disabled="disabled" /></div>
				<div><input onfocus="this.value=strip_number_format(this.value)" onblur="this.value=this.value.replace(/[^\d\.]/g,'');if(this.value.length==0){this.value=0;} this.value=number_format(parseFloat(this.value),2)" class="iznos" type="text" value="{{$otp_kamata}}" /></div>
				<div><input onfocus="this.value=strip_number_format(this.value)" onblur="this.value=this.value.replace(/[^\d\.]/g,'');if(this.value.length==0){this.value=0;} this.value=number_format(parseFloat(this.value),2)" class="iznos" type="text" value="{{$otp_troskovi}}" /></div>
				<div><input title="obeleži za brisanje" type="checkbox" onchange="this.parentNode.parentNode.className=this.parentNode.parentNode.className=='selected'?'':'selected';" /></div>
			</li>
			{{%loop end}}
			<li id="summary">
				<div>&nbsp;</div>
				<div>UKUPNO:</div>
				<div>{{$otp_sum_bruto}}</div>
				<div>{{$otp_sum_neto}}</div>
				<div>{{$otp_sum_porez}}</div>
				<div>{{$otp_sum_kamata}}</div>
				<div>{{$otp_sum_troskovi}}</div>
				<div></div>
			</li>
		</ul>
	</fieldset>
</blockquote>
</div>